<template>
  <el-dialog
    v-model="dialogVisible"
    top="10vh"
    width="750px"
    @close="closeDialog"
  >
    <el-form
      label-width="90px"
      style="min-width: 600px; width: 600px; margin-left:35px;"
    >
      <!-- 图片 -->
      <el-form-item
        label="轮播图片"
        prop="imgUrl"
      >
        <img-upload v-model="Data.imgUrl" />
      </el-form-item>
      <!-- 平台 -->
      <el-form-item
        label="平台"
        prop="imgType"
      >
        <el-radio
          v-model="Data.imgType"
          :label="0"
        >
          移动端
        </el-radio>
      </el-form-item>
      <!-- 状态 -->
      <!-- <el-form-item -->
      <!-- label="状态" -->
      <!-- prop="status" -->
      <!-- > -->
      <!-- <el-radio -->
      <!-- v-model="Data.status" -->
      <!-- :label="0" -->
      <!-- > -->
      <!-- 禁用 -->
      <!-- </el-radio> -->
      <!-- <el-radio -->
      <!-- v-model="Data.status" -->
      <!-- :label="1" -->
      <!-- > -->
      <!-- 正常 -->
      <!-- </el-radio> -->
      <!-- </el-form-item> -->
      <!-- 排序 -->
      <el-form-item
        label="作为"
        prop="seq"
      >
        <el-select
          v-model="Data.seq"
          placeholder="选择类型"
          style="width: 240px"
        >
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
    </el-form>
    <template #footer>
      <el-button @click="createIndexImg">
        创建
      </el-button>
    </template>
  </el-dialog>
</template>

<script setup>
import * as api from '@/api/platform/index-img'

const emit = defineEmits(['close'])

const prop = defineProps({
  addOrUpdateVisible: Boolean
})
const dialogVisible = ref(prop.addOrUpdateVisible)
watch(() => prop.addOrUpdateVisible, (val) => {
  dialogVisible.value = val
})

const Data = reactive({
  imgUrl: '/2024/04/09/ae9be89e7f6146b1bd309bc20c69663b',
  status: 1,
  seq: 0,
  imgType: 0
})
const options = ref([
  {
    label: '微信',
    value: 2
  },
  {
    label: '小红书',
    value: 1
  },
  {
    label: '群聊',
    value: 0
  }
])
function closeDialog () {
  emit('close', true)
}
function createIndexImg () {
  api.addIndexImg(Data)
    .then(() => {
      ElMessage.success('创建成功')
      emit('close', true)
    })
    .catch(() => {
      ElMessage.error('创建失败')
    })
}

</script>
